import { FormProps, FormSchema } from '/@/components/Table';
import { BasicColumn } from '/@/components/Table/src/types/table';
import { getJulyDictItemListByTypeApi } from '/@/api/admin/julyDictItemApi';
import { getClassificationTreeApi } from "/@/api/website/websiteClassificationApi";
import { uploadApi } from '/@/api/sys/upload';

import {defHttp} from "/@/utils/http/axios";
import {ProfessionModel} from "/@/api/model/websiteProfessionModel";
import {h} from "vue";
import {Tag} from "ant-design-vue";
import {Tinymce} from "/@/components/Tinymce";


//表格显示列
export function getBasicColumns(): BasicColumn[] {
  // @ts-ignore
  return [
    {
      title: 'ID',
      dataIndex: 'professionId',
      fixed: 'left',
      width: 100,
    },
    {
      title: '专业名称',
      dataIndex: 'profession',
      width: 150,

    },
    {
      title: '专业级别',
      dataIndex: 'professionLevelCh',
      width: 100,
    },
    {
      title: '所属分类',
      dataIndex: 'classificationName',
      width: 150,
      //sorter: true,
      //defaultHidden: true,
    },
    {
      title: '课时数',
      width: 100,
      dataIndex: 'price',
    },
    {
      title: '是否为鉴定工种',
      width: 100,
      dataIndex: 'isAppraisal',
      customRender: ({record}) => {
        let isAppraisal = record.isAppraisal;
        let color = ''
        switch (isAppraisal) {
          case '0':
            isAppraisal = '是';
            color = 'green'
            break;
          case '1':
            isAppraisal = '否';
            color = 'purple'
            break;
        }
        return h(Tag, {color: color}, () => isAppraisal);
      },
    },
    {
      title: '排序',
      width: 100,
      dataIndex: 'indexOrder',
    },
  ];
}

export function getFormConfig(): Partial<FormProps> {
  return {
    labelWidth: 150,
    baseColProps: { lg: 6, md: 24 },
    schemas: formParamSchema,
  };
}


//编辑表单
export const formParamSchema: FormSchema[] = [
  {
    field: 'profession',
    label: '专业名称',
    component: 'Input',
  },
  {
    field: 'professionLevel',
    label: '专业级别',
    component: 'ApiSelect',
    componentProps: {
      api: getJulyDictItemListByTypeApi,
      params: { type: 'PROFESSION_LEVEL' },
      labelField: 'label',
      valueField: 'value',
    },
  },
  {
    field: 'classificationId',
    label: '所属分类',
    component: 'TreeSelect',
    helpMessage: ['若没有分类,请到分类管理中添加'],
    componentProps: {
      fieldNames: {
        label: 'name',
        key: 'classificationId',
        value: 'classificationId',
      },
      getPopupContainer: () => document.body,
    },
  },

  {
    field: 'isAppraisal',
    label: '是否为鉴定工种',
    component: 'RadioButtonGroup',
    defaultValue: '',
    componentProps: {
      options: [
        { label: '全部', value: '' },
        { label: '是', value: '0' },
        { label: '否', value: '1' },
      ],
    },
  },
];

//编辑表单
export const formSchema: FormSchema[] = [
  {
    field: 'profession',
    label: '专业名称',
    component: 'Input',
    required: true,
  },
  {
    field: 'professionLevel',
    label: '专业级别',
    component: 'ApiSelect',
    componentProps: {
      api: getJulyDictItemListByTypeApi,
      params: { type: 'PROFESSION_LEVEL' },
      labelField: 'label',
      valueField: 'value',
    },
    required: true,
  },

  {
    field: 'briefIntroduction',
    label: '简介',
    component: 'InputTextArea',

    required: true,
  },

  {
    field: 'professionDetails',
    label: '详情',
    component: 'Input',
    required: true,
    defaultValue: '',
    render: ({model, field}) => {
      return h(Tinymce, {
        value: model[field],
        onChange: (value: string) => {
          model[field] = value;
        },
      });
    },
  },
  {
    field: 'onlineClassLink',
    label: '网课地址',
    component: 'InputTextArea',
  },

  {
    field: 'enrollCondition',
    label: '学习条件',
    component: 'InputTextArea',
    required: true,
  },
  {
    field: 'coverImage',
    label: '封面图',
    component: 'Upload',
    componentProps: {
      api: uploadApi,
      accept: ['jpg', 'png', 'jpeg'],
      maxNumber: 1,
      maxSize: 1,
      helpText: '请上传png/jpg 等图片文件，文件大小小于1M,宽高比为7:4',
    },
    required: true,
  },
  {
    field: 'classificationId',
    label: '所属分类',
    component: 'TreeSelect',
    helpMessage: ['若没有分类,请到分类管理中添加'],
    componentProps: {
      fieldNames: {
        label: 'name',
        key: 'classificationId',
        value: 'classificationId',
      },
      getPopupContainer: () => document.body,
    },
    required: true,
  },
  {
    field: 'lessonPeriods',
    label: '课时数',
    component: 'InputNumber',
    required: true,
  },
  {
    field: 'price',
    label: '价格',
    component: 'InputNumber',
    required: true,
  },
  {
    field: 'indexOrder',
    label: '显示顺序',
    component: 'InputNumber',
    required: true,
  },
  {
    field: 'isAppraisal',
    label: '是否为鉴定工种',
    component: 'RadioButtonGroup',
    defaultValue: '0',
    required: true,
    componentProps: {
      options: [
        { label: '是', value: '0' },
        { label: '否', value: '1' },
      ],
    },
  },
];
